<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>月度出差计划单</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="/general/erp5/public/step-lay/css/layui.css" media="all">
    <link rel="stylesheet" href="/general/erp5/public/step-lay/css/default.css?t=1586046995308" media="all">
</head>
<style>
    .layui-breadcrumb {
        visibility: initial;
    }
</style>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">
                    <div class="layui-card-header">
                        {include file="../application/travel/view/travelplan/bar.html" /}
                    </div>
                </div>
                <div class="layui-card-body">
                    <form class="layui-form " action="" lay-filter="form-1">
                        <div class="layui-form-item">
                            <div class="layui-input-inline">
                                <input name="orderNum" id="creator" placeholder="按填报人过滤" lay-verify=""
                                       class="layui-input" type="text">
                            </div>
                            <div class="layui-input-inline">
                                <input id="cCusName" name="traveler" placeholder="按出差人过滤" type="text"
                                       class="layui-input" readonly>
                            </div>
                            <div class="layui-input-inline-sm" style="">
                                <select name="city" lay-verify="" lay-search>
                                    <option value="1">只看自己</option>
                                    <option value="2">查看所有</option>
                                </select>
                            </div>
                            <div class="layui-input-inline" style="width: 300px;">
                                <input type="text" name="selFlag" value="" style="display: none;"/>
                                <button lay-submit lay-filter="subBtn" class="layui-btn layui-btn-sm">过滤</button>
                                <button type="reset" class="layui-btn layui-btn-sm layui-btn-primary">重置</button>
                            </div>
                        </div>
                    </form>
                    <table class="layui-hide" id="apply_list" lay-filter="apply_list"></table>
                </div>
            </div>
        </div>
    </div>
</div>


<script type="text/html" id="toolbaradd">
    <div class="layui-btn-container">
        <a class="layui-btn layui-btn-sm" lay-event="add">新增月度出差单</a>
    </div>
</script>


<script type="text/html" id="toolbarapplication">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>

<!--<script src="/general/erp5/public/layui/jquery.js"></script>-->
<script src="/general/erp5/public/step-lay/layui.js"></script>

<script>
    function getQueryString(name) {
        var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
        var r = window.location.search.substr(1).match(reg);
        if (r != null) {
            return unescape(r[2]);
        }
        return null;
    }

    layui.use('table', function () {
        var table = layui.table;

        table.render({
            elem: '#apply_list'
            , url: '/general/erp5/public/travel/travelplan/GetListByAjax?nid=' + getQueryString('nids')
            , request: {
                page: 'page',   // 页码的参数名称，默认：page
                limit: 'limit'   // 每页数据量的参数名，默认：limit
            }
            , response: {
                statusName: 'status'
                , statusCode: 200
                , msgName: 'msg'
                , countName: 'count'
                , dataName: 'data'
            }
            , cols: [[
                {checkbox: true, fixed: true}
                , {field: 'id', title: 'ID', width: 70, align: 'center'}
                , {field: 'plan_num', title: '计划单号', width: 150, align: 'center'}
                , {field: 'status1', title: '审批状态', width: 150, align: 'center'}
                , {field: 'department', title: '部门名称', width: 150, align: 'center'}
                , {field: 'creator', title: '出差人姓名', width: 150, align: 'center'}
                , {field: 'total_day', title: '出差天数', width: 150, align: 'center'}
                , {field: 'traffic_money', title: '交通费', width: 150, align: 'center'}
                , {field: 'hotel_money', title: '住宿费', width: 150, align: 'center'}
                , {field: 'meal_money', title: '餐饮费', width: 150, align: 'center'}
                , {field: 'total_money', title: '总和', width: 150, align: 'center'}
                , {field: 'create_time', title: '创建时间', width: 150, align: 'center'}
                , {field: '', title: '操作', width: 280, fixed: 'right', align: 'center', toolbar: '#toolbarapplication'}
            ]]
            , id: 'testReload'
            , page: true
            , limit: '25'
            , toolbar: "#toolbaradd"
            , text: {none: '暂无相关数据'}
        });

        //头工具栏事件
        table.on('toolbar(apply_list)', function (obj) {
            switch (obj.event) {
                case 'add':
                    location.replace("/general/erp5/public/travel/travelplan/add");
                    break;
            }
        })

        function selectRole(planid) {
            layer.open({
                //layer提供了5种层类型。可传入的值有：0（信息框，默认）1（页面层）2（iframe层）3（加载层）4（tips层）
                type: 2,
                title: "补充明细",
                area: ['100%', '100%'],
                content: "/general/erp5/public/travel/travelplan/edit?id=" + planid,
                success: function () {
                    form.render();
                },
                end: function () {
                    table.reload('testReload');
                }
            });
        }

        //监听行工具事件
        table.on('tool(apply_list)', function (obj) {
            switch (obj.event) {
                case 'edit':
                    var id = obj.data.id;
                    selectRole(id);
                    break;
            }

            // var data = obj.data;
            // console.log(data)
            // if (obj.event === 'del') {
            //     layer.confirm('真的删除行么', function (index) {
            //         obj.del();
            //         layer.close(index);
            //     });
            // } else if (obj.event === 'edit') {
            //     alert(2);
            // }

        });
    });
</script>

</body>
</html>